<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
 <style>
    #box {
        width: 200px;
        height: 200px;
        background-color: antiquewhite;
    }
 </style>
  </head>
  <body>
    <!-- //行内绑定 -->
    <button id="btn">提交</button>
    <div id="box"></div>
    <script>
    //   function fn() {
    //     console.log('hello');
    //   }

    //   //动态绑定
    //   var box = document.getElementById('box')
    //   box.onclick = function(){
    //     this.style.backgroundColor ='red'
    //   }


      //onload 页面加载
      //页面结构和资源加载完执行
    //   window.onload = function(){
    //     console.log('onload')
    //   }
    //   //页面结构加载完执行，不需要等待资源
    //   document.DOMContentLoaded = function(){
    //         console.log('DOMContentLoaded')
    //   }

    //改变窗口大小
      // window.onresize = function(){
      //   //窗口宽度
      //   console.log(window.innerWidth);
      //   console.log(window.innerheight)
      // }

 
    
      

    </script>
  </body>
</html>
